class Hero {
    constructor(ctx) {
        this.ctx = ctx;
        this.img = new Image();
        this.img.src = 'images/hero.png';
        // this.img.src = '/images/hero.png'
        // 飞机坐标数据
        this.init = {
            x: this.ctx.canvas.width / 2 - 186 / 4,
            y: this.ctx.canvas.height - 130,
            w: 186 / 2,
            h: 130 / 2
        }
        // //// 监听英雄飞机的移动操作 && 和后面listen实现一样有效
        // wx.onTouchStart(function (e) {
        //     console.log('start');
        // });
        // // 手指按下后移动时触发
        // wx.onTouchMove(function (e) {
        //     console.log('move');
        // });
        // // 手指离开时触发
        // wx.onTouchEnd(function (e) {
        //     console.log('end');
        // });
    }

    draw() {
        this.ctx.drawImage(this.img, this.init.x, this.init.y, this.init.w, this.init.h)
    }

    listen() {
        // 监听英雄飞机的移动操作
        this.ctx.canvas.addEventListener('touchstart', e => {
            console.log('start');
            console.log(e);
            let dot = e.touches[0];
            if (dot.clientX > this.init.x && dot.clientX < this.init.x + this.init.w && dot.clientY > this.init.y && dot.clientY < this.init.y + this.init.h) {
                this.touchStatus = true;
                console.log('googoggo');

                console.log(e);

            }

        })
        this.ctx.canvas.addEventListener('touchend', e => {
            // console.log('end');
            // console.log(e);
            this.touchStatus = false;
        })
        this.ctx.canvas.addEventListener('touchmove', e => {
            // console.log('move');
            // console.log(e);
            if (this.touchStatus) {
                let dot = e.touches[0];
                let x = dot.clientX;
                let y = dot.clientY;
                this.init.x = x - this.init.w / 2;
                this.init.y = y - this.init.h / 2;

                if (this.init.x < 0) {
                    this.init.x = 0;
                }
                if (this.init.x > this.ctx.canvas.width - this.init.w) {
                    this.init.x = this.ctx.canvas.width - this.init.w;
                }
                if (this.init.y < 0) {
                    this.init.y = 0;
                }
                if (this.init.y > this.ctx.canvas.height - this.init.h) {
                    this.init.y = this.ctx.canvas.height - this.init.h;
                }
            }
        })

    }
}

export default Hero;